<!DOCTYPE html>
<html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.3/vue.js"></script>
    <style>

        .sss {
            background-position: top left;
            background-size: 100%, 100%;
            width: 150px;
            height: 150px;
            background-repeat: no-repeat;
        }

    </style>
</head>
<body>
<div id="root">
    <div>
        <img :src="base64">
    </div>

    <br><br><br><br>

    <div class="sss" :style="{backgroundImage:`url(${base64})`}">
        <span>背景图背景图背景图背景图1</span>
    </div>

    <br><br><br><br>

    <div class="sss" :style="{backgroundImage:'url(' + base64 + ')'}">
        <span>背景图背景图背景图背景图2</span>
    </div>

    <br><br><br><br>

    <div :style="{backgroundImage:'url(' + base64 + ')',width : '150px',height : '150px', backgroundRepeat:'no-repeat', backgroundPosition:'center center', backgroundSize: 'contain'}">
        <span>背景图背景图背景图背景图3</span>
    </div>
</div>


<script>
    new Vue({
        el: "#root",
        data: {
            str: "6666",
            base64: ''
        }, created() {
            console.log(`baseurl:${this.str}`);
            console.log("baseurl:${this.str}");
            console.log('baseurl:${this.str}');
            //
            console.log("baseurl:" + this.str);
            console.log('baseurl:' + this.str);
        }
    })
</script>
</body>
</html>
